<!-- <template lang="html">
  <div class="publicBox shoppingTrolley">
    <div class="shoppingTrolleySearch">
      <div class="searchBox">
        <el-input placeholder="请输入内容" prefix-icon="el-icon-search" v-model="search">
          <el-button slot="append" @click="searchK">搜索</el-button>
        </el-input>
      </div>

    </div>
    <div class="publicBoxTitle pubTitle">
      购物车列表
    </div>
    <div v-show="loadshow" class="loadingBox">
      <el-row v-loading="loading"
              element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading">
        <el-col></el-col>
      </el-row>
    </div>
    <div class="publicBoxContent shoppingTrolleyTable" v-show="!loadshow">

      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="直邮/一般贸易" name="first">
          <div v-show="loadshow1" class="loadingBox">
            <el-row v-loading="loading"
                    element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading">
              <el-col></el-col>
            </el-row>
          </div>
          <el-table v-show="!loadshow1" :data="other" ref="multipleTable" border style="width: 100%"
                    @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" :selectable='selectEnable'></el-table-column>
            <el-table-column label="商品" min-width="300">
              <template slot-scope="scope">
                <div class="commodity">
                  <div class="commodityLeft">
                    <img :src="$getImg(scope.row.images)" alt="">
                  </div>
                  <div class="commodityRight">
                    <p class="name" @click="goto(scope.row)">{{scope.row.goods_name}}</p>
                    <p class="num">数量: {{scope.row.total_num}}</p>
                  </div>

                </div>
              </template>
</el-table-column>selectEnable
<el-table-column prop="trade_type_name" label="贸易类型"></el-table-column>
<el-table-column prop="goods_sku.goods_attr" label="规格"></el-table-column>
<el-table-column prop="goods_sku.goods_price" label="单价"></el-table-column>
<el-table-column prop="total_num" label="购买数量" width="210">
    <template slot-scope="scope">
                <div class="noSKU">
                  <el-input placeholder="请输入内容" disabled v-model.number="scope.row.total_num" class="purchaseQuantity">
                    <template slot="prepend">
                      <i class="el-icon-minus" @click="reduce(scope.row)"></i>
                    </template>
    <template slot="append">
                      <i class="el-icon-plus" @click="add(scope.row)"></i>
                    </template>
    </el-input>
    <div class="mengc" v-show="!scope.row.goods_sku">
        规格已下架
    </div>
    </div>
    </template>
</el-table-column>
<el-table-column prop="total_pay_price" label="金额"></el-table-column>
<el-table-column prop="date" label="操作">
    <template slot-scope="scope">
                <el-button type="text" @click="del(scope.row.cart_id)">删除</el-button>
              </template>
</el-table-column>

</el-table>


</el-tab-pane>
<el-tab-pane label="保税" name="second">
    <div v-show="loadshow1" class="loadingBox">
        <el-row v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading">
            <el-col></el-col>
        </el-row>
    </div>
    <el-table v-show="!loadshow1" :data="bonded" ref="multipleTable1" border style="width: 100%" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" :selectable='selectEnable'></el-table-column>
        <el-table-column label="商品" min-width="300">
            <template slot-scope="scope">
                <div class="commodity">
                  <div class="commodityLeft">
                    <img :src="$getImg(scope.row.images)" alt="">
                  </div>
                  <div class="commodityRight">
                    <p class="name" @click="goto(scope.row)">{{scope.row.goods_name}}</p>
                    <p class="num">数量: {{scope.row.total_num}}</p>
                  </div>
                </div>
              </template>
        </el-table-column>
        <el-table-column prop="trade_type_name" label="贸易类型"></el-table-column>
        <el-table-column prop="goods_sku.goods_attr" label="规格"></el-table-column>
        <el-table-column prop="goods_sku.goods_price" label="单价"></el-table-column>
        <el-table-column prop="total_num" label="购买数量" width="210">
            <template slot-scope="scope">
                <div class="noSKU">
                  <el-input placeholder="请输入内容" disabled v-model.number="scope.row.total_num" class="purchaseQuantity">
                    <template slot="prepend">
                      <i class="el-icon-minus" @click="reduce(scope.row)"></i>
                    </template>
            <template slot="append">
                      <i class="el-icon-plus" @click="add(scope.row)"></i>
                    </template>
            </el-input>
            <div class="mengc" v-show="!scope.row.goods_sku">
                规格已下架
            </div>
            </div>
            </template>
        </el-table-column>
        <el-table-column prop="total_pay_price" label="金额"></el-table-column>
        <el-table-column prop="date" label="操作">
            <template slot-scope="scope">
                <el-button type="text" @click="del(scope.row.cart_id)">删除</el-button>
              </template>
        </el-table-column>

    </el-table>
</el-tab-pane>

</el-tabs>

</div>
<div class="shoppingTrolleyBase">
    <div class="baseLeft">
        <div @click="toggleSelection" :class="[sum == tableData.length ? 'all' : '']">
            全选
        </div>
        <div v-if="sum>0" @click="delet" class="dele">
            删除
        </div>
    </div>
    <div class="baseRight">
        <template v-if="show">
          <span class="describe">已选<span>{{sum}}</span>件商品 商品合计(不含运费)：</span>
          <span class="monery">￥<span>{{totalPrice}}</span></span>
          <div @click="submitOrder">提交订单</div>
        </template>
        <template v-else>
          <span class="monery">
             请注意,保税商品只能单独购买!
          </span>

        </template>

    </div>
</div>
</div>
</template> -->

<template>
    <div class="mall-portal">
        <homeTop :active="1"></homeTop>
        <div class="home-layout">    
            <div class="mall-layout-main">
                <div class="shoppingCart_shoppingCart-wrapper__fs1wc">
                    <el-tabs v-model="activeName" @tab-click="handleClick">
                        <el-tab-pane label="一般贸易/直邮" name="first">
                            <div class="ant-spin-nested-loading">
                                <div class="ant-spin-container">
                                    <div class="tab-head">
                                        <div class="goods">
                                            商品
                                        </div>
                                        <div class="nub">数量</div>
                                        <div class="oneprice">单价</div>
                                        <div class="good-price">商品金额</div>
                                        <div class="operate">操作</div>
                                    </div>
                                    <div class="shoppingCart_goods-table-component__Cahc8">
                                        <div class="ant-table-wrapper shoppingCart_each_shop_goods__ptdSO">
                                            <div class="ant-spin-nested-loading">
                                                <div class="ant-spin-container">
                                                    <div class="ant-table">
                                                        <el-table
                    ref="multipleTable"
                    :data="yibandata"
                    tooltip-effect="dark"
                    style="width: 100%"
                    @selection-change="handleSelectionChange">
                    <el-table-column
                      type="selection"
                      width="50">
                    </el-table-column>
                    <el-table-column
                      label="平台自营"
                      width="520.25">
                      <template slot-scope="scope">
                        <div class="shoppingCart_goods-item-wrapper__6UkHi">
                            <div class="shoppingCart_goods-image__T">
                                <div class="ant-image">
                                    <img style="height: 84px;" :src="scope.row.big_img" alt="">
                                </div>
                            </div>
                            <div class="shoppingCart_goods-info__iGmTX">
                                <span class="shoppingCart_title__5QwTP goods_item_table_title" style="color: #333;">
                                    {{scope.row.goods_name}}
                                </span>
                                <div class="ant-space ant-space-horizontal ant-space-align-center shoppingCart_info-attr__x4eJk">
                                    <div class="ant-space-item" style="color: #999;font-size: 12px;">
                                        <span>{{scope.row.goods_sku.goods_attr}} </span>
                                    </div>
                                </div>
                                <span class="shoppingCart_goods-type__ybs0D">{{scope.row.trade_type_name}}</span>
                            </div>
                        </div>
                      </template>
</el-table-column>
<el-table-column width="320" :key="tablekey">
    <template slot-scope="scope">
                        <div class="shuling-box">
                            <el-input-number size="mini" v-model="scope.row.total_num" @change="(oldval, newval) => inputChange(oldval, newval, scope.row)" :min="1" :max="10"></el-input-number>
                        </div>
                        <!-- <el-input-number v-model="num" @input="changeValue" size="small" :min="0" :max="99"/> -->
                    </template>
</el-table-column>
<el-table-column width="135.58">
    <template slot-scope="scope">
                        <div class="shuling-box">
                            ¥{{scope.row.goods_price}}
                    </div>
                    </template>
</el-table-column>
<el-table-column width="135.58">
    <template slot-scope="scope">
                        <div class="shuling-box">
                            ¥{{(Number(scope.row.total_num) * Number(scope.row.goods_price)).toFixed(2)}}
                        </div>
                    </template>
</el-table-column>
<el-table-column width="98.44">
    <template slot-scope="scope">
                        <div class="shuling-box" style="justify-content: flex-end;cursor: pointer;">
                            <i class="el-icon-delete" @click="deleteIcon(scope.row.cart_id)"></i>
                        </div>
                    </template>
</el-table-column>
</el-table>
</div>

</div>
</div>
</div>
</div>
<div class="shoppingCart_submit-footer-row__XJFiN">
    <div>
        <el-checkbox v-model="yibanchecked" @change="allcheckbox">全选</el-checkbox>
        <span class="shoppingCart_total-quantity__2BRjc">(共{{this.yibandata.length}}笔)</span>
    </div>
    <div class="shoppingCart_submit-footer-right__HDTKp">
        <span class="shoppingCart_right-word__u">
            已选中
            <span class="shoppingCart_word-num__gpGbM">{{this.yibanclickorder.length}}</span> 笔
        </span>
        <span class="shoppingCart_right-word__u">
            合计（不含运费&税费）
            <span class="shoppingCart_currency_symbol__qc63f">
                ¥
                <span class="shoppingCart_word-price__vHIWn">{{yibantotalplace.toFixed(2)}}</span>
        </span>
        </span>
        <el-button type="primary" @click="ybsubmitOrder">立即下单</el-button>
    </div>
</div>


</div>
</div>
</el-tab-pane>
<el-tab-pane label="保税" name="second">
    <div class="ant-spin-nested-loading">
        <div class="ant-spin-container">
            <div class="tab-head">
                <div class="goods">
                    商品
                </div>
                <div class="nub">数量</div>
                <div class="oneprice">单价</div>
                <div class="good-price">商品金额</div>
                <div class="operate">操作</div>
            </div>
            <div class="shoppingCart_goods-table-component__Cahc8">
                <div class="ant-table-wrapper shoppingCart_each_shop_goods__ptdSO">
                    <div class="ant-spin-nested-loading">
                        <div class="ant-spin-container">
                            <div class="ant-table">
                                <el-table ref="bsmultipleTable" :data="baoshuidata" tooltip-effect="dark" style="width: 100%" @selection-change="bshandleSelectionChange">
                                    <el-table-column type="selection" width="50">
                                    </el-table-column>
                                    <el-table-column label="平台自营" width="520.25">
                                        <template slot-scope="scope">
<div class="shoppingCart_goods-item-wrapper__6UkHi">
    <div class="shoppingCart_goods-image__T">
        <div class="ant-image">
            <img style="height: 84px;" :src="scope.row.big_img" alt="">
        </div>
    </div>
    <div class="shoppingCart_goods-info__iGmTX">
        <span class="shoppingCart_title__5QwTP goods_item_table_title" style="color: #333;">
            {{scope.row.goods_name}}
        </span>
        <div class="ant-space ant-space-horizontal ant-space-align-center shoppingCart_info-attr__x4eJk">
            <div class="ant-space-item" style="color: #999;font-size: 12px;">
                <span>{{scope.row.goods_sku.goods_attr}} </span>
            </div>
        </div>
        <span class="shoppingCart_goods-type__ybs0D">{{scope.row.trade_type_name}}</span>
    </div>
</div>
</template>
                                    </el-table-column>
                                    <el-table-column width="320" :key="tablekey">
                                        <template slot-scope="scope">
<div class="shuling-box">
    <el-input-number size="mini" v-model="scope.row.total_num" @change="(oldval, newval) => inputChange(oldval, newval, scope.row)" :min="1" :max="10"></el-input-number>
</div>
<!-- <el-input-number v-model="num" @input="changeValue" size="small" :min="0" :max="99"/> -->
</template>
                                    </el-table-column>
                                    <el-table-column width="135.58">
                                        <template slot-scope="scope">
<div class="shuling-box">
    ¥{{scope.row.goods_price}}
</div>
</template>
                                    </el-table-column>
                                    <el-table-column width="135.58">
                                        <template slot-scope="scope">
<div class="shuling-box">
    ¥{{(Number(scope.row.total_num) * Number(scope.row.goods_price)).toFixed(2)}}
</div>
</template>
                                    </el-table-column>
                                    <el-table-column width="98.44">
                                        <template slot-scope="scope">
<div class="shuling-box" style="justify-content: flex-end;cursor: pointer;">
    <i class="el-icon-delete" @click="deleteIcon(scope.row.cart_id)"></i>
</div>
</template>
                                    </el-table-column>
                                </el-table>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
            <div class="shoppingCart_submit-footer-row__XJFiN">
                <div>
                    <el-checkbox v-model="baoshuichecked" @change="bsallcheckbox">全选</el-checkbox>
                    <span class="shoppingCart_total-quantity__2BRjc">(共{{this.goodlistdata.length}}笔)</span>
                </div>
                <div class="shoppingCart_submit-footer-right__HDTKp">
                    <span class="shoppingCart_right-word__u">
已选中
<span class="shoppingCart_word-num__gpGbM">{{this.baoshuiclickorder.length}}</span> 笔
                    </span>
                    <span class="shoppingCart_right-word__u">
合计（不含运费&税费）
<span class="shoppingCart_currency_symbol__qc63f">
¥
<span class="shoppingCart_word-price__vHIWn">{{baoshuitotalplace.toFixed(2)}}</span>
                    </span>
                    </span>
                    <el-button type="primary" @click="bssubmitOrder">立即下单</el-button>
                </div>
            </div>


        </div>
    </div>
</el-tab-pane>
</el-tabs>



</div>
<div class="GoodsClassify_GoodsClassify__W7HcC">
    <div class="components-GoodsClassify-header">
        <img style="width: 16px;height: 16px;margin-right: 4px;" src="https://static.xyb2b.com/images/56e5493b87b274f4768f8c566761758a.png" alt="">
        <span>爆品推荐</span>
    </div>
    <div class="components-GoodsClassify-warp">
        <el-carousel indicator-position="none" height="744px" arrow="always">
            <el-carousel-item v-for="item in 3" :key="item">
                <div class="carousel">
                    <div class="slick-slider">
                        <div class="slick-list">
                            <div class="goods-desc-wrapper" v-for="item in 10">
                                <div class="img-box">
                                    <img style="width: 100%;height: 100%;" src="../../assets/img/index/good.jpg" alt="">
                                </div>
                                <div class="goods-desc-info">
                                    <div class="info-name">
                                        <span style="color: #333;">法国FILORGA菲洛嘉 十全大补面膜 50ml</span>
                                    </div>
                                    <div class="info-hot">
                                        <div class="hot-price">
                                            <span class="price-type">¥</span>
                                            <span class="price">112.0</span>
                                        </div>
                                    </div>
                                </div>
                                <div class="goods-desc-attr">
                                    <div class="attr-item">国内仓发&保税仓发</div>
                                    <div class="attr-hot">热度&nbsp;&nbsp;121</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </el-carousel-item>
        </el-carousel>
    </div>
</div>
</div>

</div>
<homefooter></homefooter>
</div>
</template>

<script>
    import homeTop from '../assembly/top'
    import homefooter from '../assembly/footer'
    export default {
        components: {
            homeTop,
            homefooter
        },
        data() {
            return {
                yibandata: [],
                baoshuidata: [],
                activeName: 'first',
                yibantotalplace: 0,
                yibanclickorder: [],
                goodlistdata: [],
                tablekey: false,
                yibanchecked: false,
                num: 1,
                tableData: [{
                    nub: '',
                    date: '2016-05-03',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                }],
                baoshuichecked: false,
                baoshuiclickorder: [],
                baoshuitotalplace: 0,
                delectnum: 0
            }
        },
        created() {
            this.cartList()
        },
        methods: {
            handleClick(tab, event) {
                console.log(tab, event);
                this.delectnum = 0
                this.togg()
            },
            togg() {
                this.yibandata.forEach(row => {
                    this.$refs.multipleTable.toggleRowSelection(row, false);
                });
                this.baoshuidata.forEach(row => {
                    this.$refs.bsmultipleTable.toggleRowSelection(row, false);
                });
            },
            allcheckbox(e) {
                console.log(e);
                this.yibandata.forEach(row => {
                    this.$refs.multipleTable.toggleAllSelection();
                });
            },
            bsallcheckbox(e) {
                console.log(e);
                this.baoshuidata.forEach(row => {
                    this.$refs.bsmultipleTable.toggleAllSelection();
                });
            },
            cartList() {
                this.goodlistdata = []
                this.baoshuidata = []
                this.yibandata = []
                this.togg()
                this.$HttpGet("/index.php?s=admin/home.cart/lists").then(res => {
                    console.log(res);
                    this.goodlistdata = res.data.goods_list;
                    for (const a of this.goodlistdata) {
                        if (a.trade_type_name == '保税') {
                            this.baoshuidata.push(a)
                        } else {
                            this.yibandata.push(a)
                        }
                    }
                    console.log(this.baoshuidata, '4545');
                    console.log(this.yibandata);
                })
            },
            handleSelectionChange(val) {
                console.log(123);
                this.yibantotalplace = 0
                console.log(val.length);
                console.log(this.yibandata.length);
                this.yibanclickorder = val;
                if (val.length == this.yibandata.length && this.delectnum == 0) {
                    console.log(45645);
                    this.yibanchecked = true
                } else {
                    this.yibanchecked = false
                }
                for (const a of val) {
                    this.yibantotalplace += Number(a.total_num) * Number(a.goods_price)
                }
                this.delectnum = 0
            },
            bshandleSelectionChange(val) {
                this.baoshuitotalplace = 0
                console.log(val);
                this.baoshuiclickorder = val;
                if (this.baoshuiclickorder.length == this.baoshuidata.length && this.delectnum == 0) {
                    this.baoshuichecked = true
                } else {
                    this.baoshuichecked = false
                }
                for (const a of val) {
                    this.baoshuitotalplace += Number(a.total_num) * Number(a.goods_price)
                }
                this.delectnum = 0
            },
            inputChange(currentValue, oldValue, vale) {
                this.yibantotalplace = 0
                console.log(currentValue, oldValue);
                console.log(vale);
                this.num = currentValue
                this.tablekey = !this.tablekey
                if (currentValue > oldValue) {
                    this.$HttpGet("/index.php?s=admin/home.cart/add", {
                        goods_id: vale.id,
                        goods_sku_id: vale.goods_sku.spec_sku_id,
                        goods_num: 1
                    }).then(res => {
                        console.log(res);
                        for (const a of this.yibandata) {
                            this.yibantotalplace += Number(a.total_num) * Number(a.goods_price)
                        }
                    })
                } else {
                    this.$HttpGet("/index.php?s=admin/home.cart/sub", {
                        goods_id: vale.id,
                        goods_sku_id: vale.goods_sku.spec_sku_id,
                        goods_num: 1
                    }).then(res => {
                        console.log(res);
                        for (const a of this.yibandata) {
                            this.yibantotalplace += Number(a.total_num) * Number(a.goods_price)
                        }
                    })
                }

            },
            goNext() {
                this.$router.push('/index/confirm')
            },
            deleteIcon(cart_id) {
                this.$confirm('此操作将删除, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    this.$HttpGet("/index.php?s=/admin/home.cart/delete", {
                        goods_sku_id: cart_id,
                    }).then(res => {
                        this.delectnum = 1
                        this.$notifySuccess(res.msg);
                        console.log(123);
                        this.cartList();
                        this.$HttpGet("/index.php?s=/admin/home.cart/lists").then(res => {
                            this.$store.commit('CARNUM', res.data.goods_list.length)
                        })
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            ybsubmitOrder() {
                if (this.yibanclickorder.length < 1) {
                    this.$notifyError("请选择商品进行结算");
                    return false;
                }
                let cart_ids = '';
                this.yibanclickorder.forEach(item => {
                    cart_ids += item.cart_id + ','
                })
                console.log(cart_ids);
                this.$router.push({
                    path: `/index/confirm?cart_ids=${cart_ids}`
                });
            },
            bssubmitOrder() {
                if (this.baoshuiclickorder.length < 1) {
                    this.$notifyError("请选择商品进行结算");
                    return false;
                }
                let cart_ids = '';
                this.baoshuiclickorder.forEach(item => {
                    cart_ids += item.cart_id + ','
                })
                console.log(cart_ids);
                this.$router.push({
                    path: `/index/confirm?cart_ids=${cart_ids}`
                });
            }
        }
    }
</script>



<!-- <script>
    export default {
        name: "shoppingTrolley",
        data: function() {
            return {
                activeName: 'first',
                loading: true,
                loadshow: true,
                loadshow1: true,
                tableData: [],
                copyData: [],
                search: "",
                multipleSelection: [],
                totalPrice: 0,
                sum: 0,
                copyArr: [],
                typeArr: [],
                isBz: false,
                bonded: [], //保税
                other: [], //一般贸易/直邮,
                show: true

            }
        },
        created() {
            this.getList();
        },
        mounted() {
            this.$nextTick(() => {
                // var box=document.getElementsByClassName("el-table-column--selection")[0];
                // box.removeChild(box.lastElementChild);
            })

        },
        methods: {
            selectEnable(row, rowIndex) {
                if (!row.goods_sku) {
                    return false
                } else {
                    return true // 不禁用
                }
            },
            handleClick(tab, event) {

                this.togg()
            },
            searchK() {

                var arr = [];
                for (let i = 0; i < this.copyData.length; i++) {
                    if (this.copyData[i].goods_name.indexOf(this.search) != -1) {
                        arr.push(this.copyData[i])
                    }
                }

                this.tableData = arr

            },
            goto(data) {
                this.$router.push({
                        path: `/index/commodity/detail?id=${data.id}`
                    })
                    // console.log(data)
            },
            delet() {
                var carID = [];
                for (var i = 0; i < this.multipleSelection.length; i++) {
                    carID.push(this.multipleSelection[i].cart_id)
                }
                // console.log(carID.join(','))
                this.del(carID.join(','))
            },
            getList() {
                this.bonded = [];
                this.other = [];
                this.loadshow1 = true;
                this.$HttpGet("/index.php?s=/admin/home.cart/lists").then(res => {
                    this.tableData = res.data.goods_list;
                    this.copyData = res.data.goods_list;
                    this.loadshow = false;
                    this.loadshow1 = false;

                    for (let i = 0; i < res.data.goods_list.length; i++) {
                        if (res.data.goods_list[i].trade_type_name == "保税") {
                            this.bonded.push(res.data.goods_list[i])
                        } else {
                            this.other.push(res.data.goods_list[i])
                        }
                    }


                })
            },
            reduce(item) {
                if (item.total_num <= 1) {
                    return false;
                }
                item.total_num -= 1;
                item.total_pay_price = (item.total_num * parseFloat(item.goods_sku.goods_price)).toFixed(2);
                this.sum = this.multipleSelection.length;
                let monery = 0;
                this.multipleSelection.forEach(i => {
                    if (item.id == i.id) {
                        i.total_pay_price = parseFloat(item.total_pay_price);
                    }
                    monery += parseFloat(i.total_pay_price);
                });
                this.totalPrice = monery.toFixed(2);
                this.$HttpGet("/index.php?s=/admin/home.cart/sub", {
                    goods_id: item.id,
                    goods_sku_id: item.goods_sku_id,
                    goods_num: 1
                });
            },
            add(item) {
                item.total_num += 1;
                item.total_pay_price = (item.total_num * parseFloat(item.goods_sku.goods_price)).toFixed(2);
                this.sum = this.multipleSelection.length;
                let monery = 0;
                this.multipleSelection.forEach(i => {
                    if (item.id == i.id) {
                        i.total_pay_price = parseFloat(item.total_pay_price);
                    }
                    monery += parseFloat(i.total_pay_price);
                });
                this.totalPrice = monery.toFixed(2);
                this.$HttpGet("/index.php?s=/admin/home.cart/add", {
                    goods_id: item.id,
                    goods_sku_id: item.goods_sku_id,
                    goods_num: 1
                });
            },
            del(cart_id) {
                this.$confirm('确认移除该商品', '删除', {
                    type: 'error'
                }).then(res => {
                    this.$HttpGet("/index.php?s=/admin/home.cart/delete", {
                        goods_sku_id: cart_id,
                    }).then(res => {
                        this.$notifySuccess(res.msg);
                        this.getList();
                        this.$HttpGet("/index.php?s=/admin/home.cart/lists").then(res => {
                            this.$store.commit('CARNUM', res.data.goods_list.length)

                        })
                    })
                }).catch(() => {

                })
            },
            handleSelectionChange(val) {
                this.show = true;
                if (this.activeName == "second" && val.length > 1) {
                    this.show = false;
                }


                this.multipleSelection = val;
                this.sum = val.length;
                let monery = 0;
                val.forEach((item) => {
                    monery += parseFloat(item.total_pay_price);
                });
                this.totalPrice = monery.toFixed(2);
            },
            toggleSelection() {
                if (this.activeName == "first") {
                    this.other.forEach(row => {
                        this.$refs.multipleTable.toggleAllSelection();
                    });
                }
                if (this.activeName == "second") {
                    this.bonded.forEach(row => {
                        this.$refs.multipleTable1.toggleAllSelection();
                    });
                }

            },
            togg() {
                this.other.forEach(row => {
                    this.$refs.multipleTable.toggleRowSelection(row, false);
                });
                this.bonded.forEach(row => {
                    this.$refs.multipleTable1.toggleRowSelection(row, false);
                });


            },
            submitOrder() {
                if (this.multipleSelection.length < 1) {
                    this.$notifyError("请选择商品进行结算");
                    return false;
                }
                let cart_ids = '';
                this.multipleSelection.forEach(item => {
                    cart_ids += item.cart_id + ','
                })
                this.$router.push({
                    path: `/index/order/balance?cart_ids=${cart_ids}`
                });
            }
        }
    }
</script> -->

<!-- <style lang="scss" scoped>
    .shoppingTrolley {
        padding: 0 20px;
        min-width: 1020px;
        .pubTitle {
            font-weight: 1000;
        }
        .publicBoxTitle {
            margin-top: 20px;
        }
        .shoppingTrolleySearch {
            width: 100%;
            height: 90px;
            border-bottom: 1px solid #E5E5E5;
            .searchBox {
                margin-top: 25px;
                float: right;
                width: 360px;
                display: flex;
                .purchaseBtn {
                    margin-left: 20px;
                    width: 127px;
                    height: 40px;
                    line-height: 40px;
                    background: #385CC8;
                    border-radius: 20px;
                    color: #ffffff;
                    text-align: center;
                }
                /deep/ .el-input__inner {
                    border: 2px solid #385CC8;
                    border-radius: 20px 0px 0px 20px;
                }
                /deep/ .el-input-group__append {
                    border: 2px solid #385CC8;
                    border-radius: 0px 20px 20px 0px;
                    background: #385CC8;
                    color: #ffffff;
                }
                /deep/ .el-icon-search {
                    color: #385CC8;
                }
            }
        }
        .loadingBox {
            height: 100px;
            margin-top: 50px;
            position: relative;
            /deep/ .el-loading-mask {
                background: none;
                .el-icon-loading {
                    font-size: 30px;
                }
            }
        }
        .shoppingTrolleyTable {
            margin-bottom: 90px;
            .noSKU {
                position: relative;
                .mengc {
                    position: absolute;
                    width: 100%;
                    height: 100%;
                    top: 0;
                    line-height: 40px;
                    background-color: rgba(#ffffff, 1);
                    color: black;
                    text-align: center;
                }
            }
            .commodity {
                display: flex;
                position: relative;
                .commodityLeft {
                    margin-right: 10px;
                    img {
                        width: 70px;
                        height: 70px;
                    }
                }
                .commodityRight {
                    .name {
                        display: -webkit-box;
                        -webkit-box-orient: vertical;
                        -webkit-line-clamp: 2;
                        overflow: hidden;
                        height: 46px;
                        cursor: pointer;
                    }
                    .name:hover {
                        color: #999999;
                    }
                    .num {
                        color: rgba(0, 0, 0, 0.5)
                    }
                }
            }
            /deep/ .el-table {
                .el-table__body-wrapper {
                    .el-table__body {
                        tbody {
                            tr {
                                .el-table_1_column_7 {
                                    color: #E93030;
                                }
                                .el-table_1_column_6 {
                                    text-align: center;
                                }
                            }
                        }
                    }
                }
            }
            /*/deep/ .el-table_1_column_6{*/
            /*  text-align: center;*/
            /*}*/
            .purchaseQuantity {
                width: 80%;
                margin: 0 auto;
                /deep/ .el-input__inner {
                    text-align: center;
                    background-color: #ffffff;
                    /*width: 50px;*/
                }
                /deep/ .el-input-group__append {
                    background-color: #ffffff;
                    cursor: pointer;
                    padding: 0px 13px;
                    /* left: -19px; */
                    position: relative;
                }
                /deep/ .el-input-group__append:hover {
                    background: rgba(#666666, 0.1);
                    color: black;
                }
                /deep/ .el-input-group__prepend {
                    background-color: #ffffff;
                    padding: 0px 13px;
                    cursor: pointer;
                }
                /deep/ .el-input-group__prepend:hover {
                    background: rgba(#666666, 0.1);
                    color: black;
                }
            }
            .el-icon-minus,
            .el-icon-plus {
                /*cursor: pointer;*/
            }
        }
        .shoppingTrolleyBase {
            position: fixed;
            min-width: 1020px;
            bottom: 0;
            right: 20px;
            left: 120px;
            height: 88px;
            line-height: 88px;
            background: #ffffff;
            display: flex;
            justify-content: space-between;
            z-index: 99;
            .baseLeft {
                div {
                    width: 130px;
                    height: 44px;
                    line-height: 44px;
                    color: #E93030;
                    text-align: center;
                    /*background: #E93030;*/
                    border-radius: 22px;
                    display: inline-block;
                    cursor: pointer;
                    margin-left: 20px;
                    border: 1px #E93030 solid;
                }
                div:hover {
                    color: #E93030;
                    background: rgba(#E93030, 0.08);
                }
                .all {
                    background: rgba(#E93030, 0.08);
                }
                .dele {
                    background: rgba(#ffffff, 1);
                    border: 1px black solid;
                    width: 130px;
                    height: 44px;
                    line-height: 44px;
                    color: black;
                }
                .dele:hover {
                    background: rgba(#666666, 0.08);
                }
            }
            .baseRight {
                div {
                    margin-right: 20px;
                    width: 130px;
                    height: 44px;
                    line-height: 44px;
                    color: #ffffff;
                    text-align: center;
                    background: #E93030;
                    border-radius: 22px;
                    display: inline-block;
                    cursor: pointer;
                }
                div:hover {
                    background: rgba(#E93030, 0.8);
                }
                .monery {
                    color: #E93030;
                    margin-right: 20px;
                    font-weight: bold;
                    span {
                        font-size: 20px;
                    }
                }
                .describe {
                    margin-right: 10px;
                    span {
                        color: #E93030;
                    }
                }
            }
        }
    }
</style> -->
<style lang="scss" scoped>
    .mall-portal {
        background-color: #fff;
    }
    
    .home-layout {
        position: relative;
        width: 100%;
    }
    
    .mall-layout-main {
        min-height: calc(100vh - 200px px);
        margin: 0 auto;
        padding-top: 24px;
        /* background-color: #f7f8fa; */
    }
    
    .shoppingCart_shoppingCart-wrapper__fs1wc {
        width: 1280px;
        margin: 0 auto;
    }
    
    .ant-spin-nested-loading {
        position: relative;
    }
    
    .ant-spin-container {
        position: relative;
        -webkit-transition: opacity 0.3s;
        transition: opacity 0.3s;
    }
    
    .tab-head {
        color: #333;
        display: flex;
        background-color: #f7f8fa;
        height: 41px;
        padding: 0 20px;
        font-size: 12px;
    }
    
    .goods {
        width: 550.42px;
        height: 100%;
        display: flex;
        align-items: center;
    }
    
    .nub {
        width: 320px;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .oneprice {
        width: 135.59px;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .good-price {
        width: 135.59px;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .operate {
        flex: 1;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    
    .shoppingCart_goods-table-component__Cahc8 {
        margin-top: 20px;
    }
    
    .ant-table-wrapper {
        clear: both;
        max-width: 100%;
    }
    
    .shoppingCart_each_shop_goods__ptdSO {
        margin-bottom: 20px;
    }
    
    .ant-spin-nested-loading {
        position: relative;
    }
    
    .ant-spin-container {
        position: relative;
        -webkit-transition: opacity 0.3s;
        transition: opacity 0.3s;
    }
    
    .ant-table {
        /* padding: 0 12px; */
        border: 1px solid #eee;
        border-radius: 8px;
    }
    
    .ant-table-title {
        padding: 12px 8px;
        border-bottom: 1px solid #f0f0f0;
        border-radius: 2px 2px 0 0;
    }
    
    .shoppingCart_header-component__E6JOL {
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 100%;
        font-size: 12px;
    }
    
    .ant-space-align-center {
        align-items: center;
    }
    
    .ant-space-item {
        font-size: 13px;
        display: flex;
        align-items: center;
        /* justify-content: center; */
        margin-left: 8px;
    }
    
    .ant-space {}
    
    .shoppingCart_goods-item-wrapper__6UkHi {
        display: flex;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding: 4px 4px 4px 0;
    }
    
    .shoppingCart_goods-image__T {
        position: relative;
    }
    
    .ant-image {
        width: 84px;
        height: 84px;
    }
    
    .shoppingCart_goods-info__iGmTX {
        display: flex;
        -ms-flex: 1 1;
        flex: 1 1;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: start;
        align-items: flex-start;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 350px;
        margin-left: 15px;
        overflow: hidden;
        color: #999;
        font-size: 12px;
    }
    
    .shoppingCart_title__5QwTP .goods_item_table_title {
        display: -webkit-box;
        width: 100%;
        margin-bottom: 8px;
        overflow: hidden;
        color: #333;
        text-align: left;
        text-overflow: ellipsis;
        word-break: break-all;
        cursor: pointer;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
    
    .ant-space .ant-space-horizontal .ant-space-align-center .shoppingCart_info-attr__x4eJk {
        margin-bottom: 15px;
        color: #999;
        font-weight: 400;
        font-size: 12px;
        align-items: center;
        display: inline-flex;
    }
    
    .shoppingCart_goods-type__ybs0D {
        padding: 2px 6px;
        color: #656efe;
        font-size: 12px;
        background: #f5fafd;
        border: none;
        border-radius: 2px;
    }
    
    .shuling-box {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .shoppingCart_submit-footer-row__XJFiN {
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        /* width: 1280px; */
        height: 64px;
        margin-top: 42px;
        padding: 8px 11px 8px 19px;
        color: #333;
        font-size: 12px;
        background-color: #fff;
        border-radius: 4px;
        -webkit-box-shadow: 0 1px 14px 0 rgba(29, 36, 70, 0.08);
        box-shadow: 0 1px 14px 0 rgba(29, 36, 70, 0.08);
    }
    
    .shoppingCart_submit-footer-right__HDTKp {
        color: #333;
    }
    
    .shoppingCart_right-word__u {
        margin-right: 9px;
    }
    
    .shoppingCart_word-num__gpGbM {
        color: #656efe;
        font-size: 16px;
    }
    
    .shoppingCart_currency_symbol__qc63f {
        color: #f44;
        font-size: 14px;
        vertical-align: middle;
    }
    
    .shoppingCart_word-price__vHIWn {
        margin-right: 40px;
        color: #f44;
        font-weight: 600;
        font-size: 25px;
        vertical-align: sub;
    }
    
    .shoppingCart_total-quantity__2BRjc {
        margin-left: 8px;
        color: #999;
        font-size: 12px;
    }
    
    .GoodsClassify_GoodsClassify__W7HcC {
        /* position: relative; */
        width: 1280px;
        margin: 0 auto;
    }
    
    .components-GoodsClassify-header {
        height: 34px;
        font-weight: 600;
        font-size: 16px;
        line-height: 22px;
        border-bottom: 1px solid #eee;
        margin-top: 72px;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: baseline;
        align-items: baseline;
    }
    
    .components-GoodsClassify-warp {
        margin-top: 20px;
    }
    
    .goods-desc-wrapper {
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 236px;
        height: 342px;
        margin-right: 25px;
        margin-bottom: 30px;
        overflow: hidden;
        background-color: #fff;
        border: 1px solid transparent;
    }
    
    .goods-desc-info {
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-pack: distribute;
        justify-content: space-around;
        width: 100%;
        margin-top: 8px;
    }
    
    .info-name {
        display: -webkit-box;
        height: 44px;
        overflow: hidden;
        color: #333;
        font-weight: 600;
        font-size: 14px;
        font-family: PingFangSC-Regular, PingFang SC;
        text-overflow: ellipsis;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
    }
    
    .info-hot {
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 100%;
        margin-top: 8px;
        line-height: 14px;
    }
    
    .hot-price {
        color: #f44;
        font-weight: 600;
        font-size: 22px;
    }
    
    .price-type {
        margin-right: 2px;
        font-size: 12px;
    }
    
    .price {
        font-size: 18px;
    }
    
    .goods-desc-attr {
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 100%;
        height: 18px;
        margin-top: 10px;
    }
    
    .attr-item {
        width: 150px;
        height: 18px;
        margin-right: 6px;
        overflow: hidden;
        color: #666;
        font-size: 12px;
        white-space: nowrap;
        text-overflow: ellipsis;
        word-break: break-all;
        border-radius: 1px;
    }
    
    .attr-hot {
        width: 78px;
        overflow: hidden;
        color: #999;
        font-size: 12px;
        white-space: nowrap;
        text-align: right;
        text-overflow: ellipsis;
        word-break: break-all;
    }
    
    .home-wrapper .page-main .item .goods-desc-wrapper {
        margin-right: 0;
    }
    
    .goods-desc-wrapper:nth-child(5n) {
        margin-right: 0 !important;
    }
    
    .slick-slider {
        position: relative;
        display: block;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -ms-touch-action: pan-y;
        touch-action: pan-y;
        -webkit-touch-callout: none;
        -webkit-tap-highlight-color: transparent;
    }
    
    .slick-list {
        touch-action: pan-y;
        transform: translate3d(0, 0, 0);
        display: flex;
        flex-wrap: wrap;
    }
    
    .carousel {
        width: 100%;
        display: inline-block;
    }
    
    .img-box {
        width: 236px;
        height: 236px;
        cursor: pointer;
    }
    
    .img-box:hover {
        transform: scale(1.1);
    }
</style>